<template>
  <div class="a">
    <el-row>
      <el-col :span="24"
        ><div class="grid-content bg-purple-dark">
          <dv-border-box-1 style="z-index: 999">
            <div style="padding: 50px">
              <!-- <el-row >
  <el-col :span="8"><div  style="top:-40px;"><dv-decoration-1 style="width:200px;height:50px; " /></div></el-col>
  <el-col :span="8"><div  style="top:-40px;"> <dv-decoration-5 dur='100' style="width:300px;height:40px; margin-left:center " /></div></el-col>
  <el-col :span="8"><div  style="top:-40px;"></div></el-col>
</el-row> -->
              
             
              <el-row gutter="5">
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-5 :reverse="true"
                      ></dv-border-box-5
                    >
                  </div></el-col
                >
                <el-col :span="12"
                  ><div style="height: 300px">
                    <dv-border-box-7> <map_1 /></dv-border-box-7>
                  </div></el-col
                >
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-5></dv-border-box-5>
                  </div></el-col
                >
              </el-row>

              <el-row gutter="5">
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12"
                  ><div style="height: 250px">
                    <dv-border-box-6><gitee item='sucaihua'></gitee></dv-border-box-6>
                  </div></el-col
                >
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12"
                  ><div style="height: 250px">
                    <dv-border-box-6><gitee></gitee></dv-border-box-6>
                  </div></el-col
                >
              </el-row>

              <el-row gutter="5">
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-13 > <skills /></dv-border-box-13>
                  </div></el-col
                >
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-12><dv-capsule-chart :config="config" style="width:300px;height:200px" /> </dv-border-box-12>
                  </div></el-col
                >
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-12><dv-capsule-chart :config="config" style="width:300px;height:200px" />  </dv-border-box-12>
                  </div></el-col
                >
                <el-col :span="6"
                  ><div style="height: 300px">
                    <dv-border-box-13> <skills /></dv-border-box-13>
                  </div></el-col
                >
              </el-row>
            </div>
          </dv-border-box-1>
        </div></el-col
      >
    </el-row>
  </div>
</template>

<script>
import PieChart from "@/views/dashboard/admin/components/PieChart";
import RaddarChart from "@/views/dashboard/admin/components/RaddarChart";
import gitee from "./components/gitee"
import skills from "./components/skills"
import language from "./components/language"
import map_1 from "./components/map.vue"
export default {
  components: {
    PieChart,RaddarChart,gitee,skills,language,map_1
  },
  
  data() {
    return{
      config:{
        data: [
    {
      name: 'Vue',
      value: 167
    },
    {
      name: 'JavaScript',
      value: 67
    },
    {
      name: 'CSS',
      value: 123
    },
    {
      name: 'ESLint',
      value: 55
    },
    {
      name: 'C++',
      value: 98
    },
    { name:"Java",value:67},
    { name:"Python",value:67},
    { name:"C++",value:67},

    { name:"Kotlin",value:67},
    { name:"TypeScript",value:67},


    { name:"C",value:67},

    { name:"Kotlin",value:67},
    { name:"TypeScript",value:67},
  
 
 
  ]
      },
      config_1:{
  points: [
    {
      name: '郑州',
      coordinate: [0.48, 0.35],
      halo: {
        show: true,
      },
      icon: {
        src: 'http://datav.jiaminghi.com/img/flylineChart/mapCenterPoint.png',
        width: 30,
        height: 30
      },
      text: {
        show: false
      }
    },
    {
      name: '新乡',
      coordinate: [0.80, 0.23]
    },
    {
      name: '焦作',
      coordinate: [0.43, 0.29]
    },
    {
      name: '开封',
      coordinate: [0.59, 0.35]
    },
    {
      name: '许昌',
      coordinate: [0.53, 0.47]
    },
    {
      name: '平顶山',
      coordinate: [0.45, 0.54]
    },
    {
      name: '洛阳',
      coordinate: [0.36, 0.38]
    },
    {
      name: '周口',
      coordinate: [0.62, 0.55],
      halo: {
        show: true,
        color: '#8378ea'
      }
    },
    {
      name: '漯河',
      coordinate: [0.56, 0.56]
    },
    {
      name: '南阳',
      coordinate: [0.37, 0.66],
      halo: {
        show: true,
        color: '#37a2da'
      }
    },
    {
      name: '信阳',
      coordinate: [0.55, 0.81]
    },
    {
      name: '驻马店',
      coordinate: [0.55, 0.67]
    },
    {
      name: '济源',
      coordinate: [0.37, 0.29]
    },
    {
      name: '三门峡',
      coordinate: [0.20, 0.36]
    },
    {
      name: '商丘',
      coordinate: [0.76, 0.41]
    },
    {
      name: '鹤壁',
      coordinate: [0.59, 0.18]
    },
    {
      name: '濮阳',
      coordinate: [0.68, 0.17]
    },
    {
      name: '安阳',
      coordinate: [0.59, 0.10]
    }
  ],
  lines: [
    {
      source: '新乡',
      target: '郑州'
    },
    {
      source: '焦作',
      target: '郑州'
    },
    {
      source: '开封',
      target: '郑州'
    },
    {
      source: '周口',
      target: '郑州',
      color: '#fb7293',
      width: 2
    },
    {
      source: '南阳',
      target: '郑州',
      color: '#fb7293',
      width: 2
    },
    {
      source: '济源',
      target: '郑州'
    },
    {
      source: '三门峡',
      target: '郑州'
    },
    {
      source: '商丘',
      target: '郑州'
    },
    {
      source: '鹤壁',
      target: '郑州'
    },
    {
      source: '濮阳',
      target: '郑州'
    },
    {
      source: '安阳',
      target: '郑州'
    },
    {
      source: '许昌',
      target: '南阳',
      color: '#37a2da'
    },
    {
      source: '平顶山',
      target: '南阳',
      color: '#37a2da'
    },
    {
      source: '洛阳',
      target: '南阳',
      color: '#37a2da'
    },
    {
      source: '驻马店',
      target: '周口',
      color: '#8378ea'
    },
    {
      source: '信阳',
      target: '周口',
      color: '#8378ea'
    },
    {
      source: '漯河',
      target: '周口',
      color: '#8378ea'
    }
  ],
  icon: {
    show: true,
    src: 'http://datav.jiaminghi.com/img/flylineChart/mapPoint.png'
  },
  text: {
    show: true,
  },
  k: 0.5,

  bgImgSrc: 'http://datav.jiaminghi.com/img/flylineChart/map.jpg'
      }
    }
  }
};
</script>

<style scoped>
body {
  margin: 0;
}

.el-col {
  border-radius: 4px;
  margin-bottom: 5px;
}
.bg-purple-dark {
  background: #100C2A;
 
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
</style>
